<template>
  <div>
    <div class="mtb20">
      <span>回款记录（共{{ tableParams.total }}条）</span>
      <span class="fr">
        <span class="mr10">实际应收金额：<span class="text-primary">￥{{ totalInfo.actualReceivable }}</span></span>
        <span class="mr10">已回款金额：<span class="text-primary">￥{{ totalInfo.validReturnedMoney }}</span></span>
        <span class="mr10">未回款金额：<span class="text-primary">￥{{ totalInfo.noReturnedMoney }}</span></span>
      </span>
    </div>

    <zm-table-data
      :data="tableParams.data"
      :columns="columns"
      :fetch="loadList"
      :table-params="tableParams"
    ></zm-table-data>
  </div>
</template>

<script>
import tableMixin from '@/mixins/zmTableMixin'
import { returnMoneyColumns } from './const'
import returnedMoneyApis from '@/api/src/returnedMoney'

export default {
  mixins: [tableMixin],
  props: {
    infoData: {
      type: Object,
      default () {
        return {}
      }
    }
  },
  data () {
    return {
      totalInfo: {}
    }
  },
  computed: {
    columns () {
      return returnMoneyColumns(this)
    }
  },
  created () {},
  methods: {
    async loadList () {
      const res = await returnedMoneyApis.getPageList(
        this.assignQuery({ orderNo: this.infoData.orderNo, listType: '1' })
      )
      this.initialTableData(res.list, res.count)
      const total = await returnedMoneyApis.getSalePriceData({
        orderNo: this.infoData.orderNo
      })
      this.totalInfo = total
    },
    onDetail () {
      // 跳转到xx详情
    }
  }
}
</script>
